.merak-collapse {
  display: flex;
  flex-direction: column;
  font-size: var(--merak-text-size);
  overflow: hidden;
  box-sizing: border-box;
  &-item {
    padding: var(--merak-space) var(--merak-padding);
    min-height: calc(var(--merak-button-large-size) + var(--merak-padding));
    background-color:var(--el-bg-color);
    border-radius: var(--merak-rounded);
    box-sizing: border-box;
    & + .merak-collapse-item {
      margin-top: var(--merak-space);
    }
    &--header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: var(--merak-button-large-size);
      &-title {
        display: flex;
        align-items: end;
        font-size: 16px;
        cursor: pointer;
        & > svg {
          align-self: center;
          margin-right: var(--merak-space);
          width: 1em;
          height: 1em;
        }
      }
      &-handler {
        display: flex;
        align-items: center;
        & > :not(:first-child) {
          margin-left: var(--merak-space);
        }
      }
    }
    &--body {
      max-height: calc(100% - var(--merak-button-large-size));
      &-wrapper {
        padding: var(--merak-space) 0;
      }
    }
  }
}
